import "package:flutter/material.dart";

class HotMenuItem {
  String title; //标题
  IconData icon; //图标名称
  Color color; //背景色
  String tip; //小标题
  HotMenuItem(
      {required this.title,
      required this.icon,
      required this.color,
      this.tip = ''});
}

class HotMenuBar extends StatelessWidget {
  final List<HotMenuItem> hotMenuList = [
    HotMenuItem(
      title: '排行榜',
      icon: Icons.bar_chart,
      color: const Color.fromARGB(255, 252, 113, 152),
    ),
    HotMenuItem(
      title: '每周必看',
      icon: Icons.calendar_today,
      color: const Color.fromARGB(255, 254, 212, 64),
    ),
    HotMenuItem(
      title: '热点日报',
      icon: Icons.newspaper,
      color: const Color.fromARGB(255, 90, 177, 255),
      tip: '抓娃娃',
    ),
    HotMenuItem(
      title: '黑马榜',
      icon: Icons.stacked_line_chart_sharp,
      color: const Color.fromARGB(255, 2, 46, 81),
      tip: '抓娃娃',
    ),
    HotMenuItem(
      title: '全网热播',
      icon: Icons.star,
      color: const Color.fromARGB(255, 248, 91, 82),
    ),
    HotMenuItem(
      title: '入站必刷',
      icon: Icons.stars_rounded,
      color: const Color.fromARGB(255, 243, 148, 31),
    ),
    HotMenuItem(
      title: '新世代',
      icon: Icons.music_note,
      color: const Color.fromARGB(255, 237, 143, 255),
    ),
    HotMenuItem(
      title: '热搜榜',
      icon: Icons.local_fire_department,
      color: const Color.fromARGB(255, 248, 92, 132),
    ),
    HotMenuItem(
      title: '音乐榜',
      icon: Icons.headset,
      color: const Color.fromARGB(255, 60, 150, 250),
    ),
    HotMenuItem(
      title: '美食',
      icon: Icons.table_bar,
      color: const Color.fromARGB(255, 253, 156, 88),
    ),
  ];

  HotMenuBar({super.key});

  @override
  Widget build(BuildContext context) {
    return SliverToBoxAdapter(
      child: Container(
        width: double.infinity,
        height: 82,
        padding: const EdgeInsets.only(top: 12),
        decoration: const BoxDecoration(
          color: Colors.white,
        ),
        child: ListView.builder(
          scrollDirection: Axis.horizontal,
          itemCount: hotMenuList.length,
          itemBuilder: (context, index) {
            HotMenuItem hotMenuItem = hotMenuList[index];
            return Container(
              width: 60,
              margin: const EdgeInsets.fromLTRB(4, 0, 4, 0),
              child: Column(
                children: [
                  Padding(
                    padding: const EdgeInsets.only(bottom: 3.5),
                    child: CircleAvatar(
                      radius: 20,
                      backgroundColor: hotMenuItem.color,
                      child: Icon(
                        hotMenuItem.icon,
                        color: Colors.white,
                      ),
                    ),
                  ),
                  Text(
                    hotMenuItem.title,
                    style: const TextStyle(
                        color: Color.fromARGB(179, 0, 0, 0), fontSize: 12),
                  )
                ],
              ),
            );
          },
        ),
      ),
    );
  }
}
